import { DIST, COMP } from '../config/canvasConfig'
import { getBodySize } from './getBodySize'
import { getTitleWidth } from '../util/getTitleWidth'

export type IContext = CanvasRenderingContext2D & { to: (x: number, y: number) => IContext }

export interface IStart {
	x: number
	y: number
}

export interface IData {
    title: string
    body: Array<{
        text: string
        peo: string[]
        org: string[]
    }>
}

export const drawLine_one = (ctx: IContext, start: IStart, data: IData): Promise<IStart> => {
	ctx.lineWidth = 4
	ctx.strokeStyle = '#073bca'
	ctx.beginPath()

	const { x, y } = start
	// main
	ctx.moveTo(x, y)
	const x2 = x + 30, y2 = y - 30
	const x3 = x2 + 100
	const x4 = x3 + 10, y3 = y2 + 10
	const x5 = x4 + 100
	const x6 = x5 + 20, y4 = y3 - 20
	const x7 = x6 + 70
	const x8 = x7 + 20, y5 = y4 + 20
	const x9 = x8 + 50 + Math.ceil(Math.random()) * 100
	ctx.to(x2, y2)
		.to(x3, y2)
		.to(x4, y3)
		.to(x5, y3)
		.to(x6, y4)
		.to(x7, y4)
		.to(x8, y5)
		.to(x9, y5)

	ctx.closePath()
	ctx.stroke()

	// upper
	ctx.lineWidth = 2
	ctx.strokeStyle = 'gray'
	ctx.beginPath()

	ctx.moveTo(x - COMP, y - DIST)
	ctx.to(x2 - COMP, y2 - DIST)
		.to(x3 - 20, y2 - DIST)
		.to(x3, y2 - DIST - 20)
		.to(x5 - 25, y2 - DIST - 20)
		.to(x5, y2 - DIST - COMP)
		.to(x8, y2 - DIST - COMP)
		.to(x8 + 25, y2)
		.to(x8 + 40, y2)
		.to(x8 + 50, y5 - DIST)
		.to(x9 - COMP, y5 - DIST)

	ctx.closePath()
	ctx.stroke()

	// under
	ctx.lineWidth = 2
	ctx.strokeStyle = 'gray'
	ctx.beginPath()

	ctx.moveTo(x + COMP, y + DIST)
	ctx.to(x2 + COMP, y2 + DIST)
		.to(x3 - COMP, y2 + DIST)
		.to(x4 - COMP, y3 + DIST)
		.to(x5 + COMP, y3 + DIST)
		.to(x6 + COMP, y4 + DIST)
		.to(x7 - COMP, y4 + DIST)
		.to(x8 - COMP, y5 + DIST)
		.to(x9 + COMP, y5 + DIST)

	ctx.closePath()
	ctx.stroke()

	// branch--upper
	ctx.lineWidth = 2
	ctx.strokeStyle = 'gray'
	ctx.beginPath()

	// b1
	ctx.moveTo(x2 - COMP, y2 - DIST)
	ctx.to(x2 - COMP + 10, y2 - DIST - 10)
		.to(x2 - COMP + 45, y2 - DIST - 10)
		.to(x2 - COMP + 65, y2 - DIST - 30)

	ctx.save()
	const AG_1 = -90

	const b1_tw = getTitleWidth('2014-02-05(发展)')
	ctx.to(x2 - COMP + 65, y2 - DIST - 30 - b1_tw)
	ctx.translate(x2 + 40, y2 - DIST - 40)
	ctx.rotate(AG_1 * Math.PI / 180)
	ctx.fillStyle = 'blue'
	ctx.measureText('2015-02-08(发展)').width
	ctx.font = 'normal normal normal bolder 18px/18px 黑体'
	ctx.fillText('2015-02-08(发展)', 0, 0, b1_tw)
	ctx.restore()

	ctx.save()

	const [b1_bw, b1_bh] = getBodySize(data.body)
	ctx.font = 'normal normal normal bolder 18px/18px 黑体'
	ctx.translate(x2 + 40, y2 - DIST - 40)
	ctx.fillText(data.body[0].text, 0, 0, b1_bw)

	ctx.restore()

	ctx.save()
	ctx.translate(x2 + 40, y2 - DIST)
	ctx.fillText(data.body[0].org.toString(), 0, 0, b1_bw)
	ctx.restore()

	ctx.save()
	ctx.translate(x2 + 40, y2 - DIST + 40)
	ctx.fillText(data.body[0].peo.toString(), 0, 0, b1_bw)
	ctx.restore()

	// b2
	ctx.moveTo(x4 - DIST - 35, y2 - DIST)
	ctx.to(x4 - DIST - COMP, y2 - DIST - 30)
		.to(x5 - DIST, y2 - DIST - 30)
		.to(x6 - DIST, y2 - DIST - 60)
		.to(x6 - DIST, y2 - DIST - 160)

	ctx.closePath()
	ctx.stroke()

	return Promise.resolve({ x: x9, y: y5 })
}